Ext.onReady(function() {
	
	var editForm = new Ext.form.FormPanel({
		labelAlign: 'right',
		region: 'center',
		labelWidth: 100,
		frame: true,
		xtype: 'fieldset',
		items: [
			{
				items: [
					{	
						columnWidth: .01, layout: 'form',
		            	items: [
		            	        { xtype: 'hidden', name: 'id', hidden:true, hiddenLabel:true}
		            	] 
			        }
				]
			},
			{
				items: [
					 {	
					 	layout: 'form',
		            	items: [
		            	        { xtype: 'textfield', name: 'userName', fieldLabel: '用户名称',allowBlank : false,anchor : '95%'}
		            	]
		            },
			        
		            {	layout: 'form',
		            	items: [
		            	        { xtype: 'textfield', name: 'realName', fieldLabel: '真实姓名 ',allowBlank : false,anchor : '95%'}
		            	]
		            },
		            {	layout: 'form',
		            	items: [
		            	        { xtype: 'textfield', name: 'password', fieldLabel: '密码 ',allowBlank : false,anchor : '95%'}
		            	]
		            },
		            {	layout: 'form',
		            	items: [
		            		new Ext.form.ComboBox({
	            	       		fieldLabel: '性别',
								name: 'sex',
								mode: 'local',
								triggerAction: 'all', 
								editable: false,
								allowBlank : false,
								valueField: 'value',
								displayField: 'text',
								anchor : '95%',
								store: new Ext.data.SimpleStore({
									fields: ['value', 'text'],
									data: [['男', '男'],['女', '女']]
								})
	            	       })
		            	]
		            },
		            {	layout: 'form',
		            	items: [
		            	        { xtype: 'textfield', name: 'email', fieldLabel: 'Email ',anchor : '95%'}
		            	]
		            },
		            {	layout: 'form',
		            	items: [
		            	        { xtype: 'textfield', name: 'phone', fieldLabel: '联系电话',allowBlank : false,anchor : '95%'}
		            	]
		            },
		            {	layout: 'form',
		            	items: [
		            	        { xtype: 'textfield', name: 'userDuty', fieldLabel: '职务', anchor : '95%'}
		            	]
		            }
				]
			}
		],
		buttons: [
			{
				text: '保存'	,
				handler: function() {
					if(!editForm.getForm().isValid())
						return;
									
					editForm.form.doAction('submit', {
						url: '/MeowcashVisa/admin/basic/UsersAction/save.action',
						method: 'post',
						params: '',
						success: function(form, action) {
							if(action.result.result == 'success') {
								Ext.MessageBox.alert('结果', '保存成功！');
								form.reset();
								grid.getStore().reload();
								editWin.hide();
							}
						}
					});
				}
			},
			{
				text: '取消'	,
				handler: function() {
					editForm.form.reset();
					editWin.hide();
				}
			}
		]
	});
	
	var editWin = new Ext.Window({
		title: '编辑用户',
        layout:'fit',
        width:450,
    	height:270,
        closeAction:'hide',
        plain: true,
        layout: 'border',
        items: [editForm]
    });
	
	var searchForm = new Ext.FormPanel({
		frame: true,
		region: 'north',
		labelAlign: 'right',
		items: [
			{
				layout: 'column',
				items: [
					{
						columnWidth: .33, layout: 'form',
		            	items: [
		            	     { xtype: 'textfield', name: 'userName', fieldLabel: '用户名称',anchor : '95%'}
		            	]
					},
					{
						columnWidth: .33, layout: 'form',
		            	items: [
		            	     { xtype: 'textfield', name: 'realName', fieldLabel: '真实姓名 ',anchor : '95%'}
		            	]
					},
					{
						columnWidth: .33, layout: 'form',
		            	items: [
		            		new Ext.form.ComboBox({
	            	       		fieldLabel: '性别',
								name: 'sex',
								hiddenName: 'sex',
								mode: 'local',
								triggerAction: 'all', 
								editable: false,
								allowBlank : false,
								valueField: 'value',
								displayField: 'text',
								anchor : '95%',
								store: new Ext.data.SimpleStore({
									fields: ['value', 'text'],
									data: [['', 'All'],['男', '男'],['女', '女']]
								})
	            	       })
		            	]
					}
				]
			}
		],
		buttons: [
			new Ext.Button({
				text: '查询',
				width: 70,
				handler: function() {
					var fv = searchForm.getForm().getValues();
					ds.baseParams= fv;
					ds.load({params: {start:0, limit:20}});
				}
			}),
			new Ext.Button({
				text: '清空',
				width: 70,
				handler: function() {
					searchForm.form.reset();
					ds.baseParams= {};
					ds.load({params: {start:0, limit:20}});
				}
			}),
			new Ext.Button({
				text: '新增',
				width: 70,
				handler: function() {
					editForm.form.reset();
					editWin.show();
				}
			})
		]
	});
	
	searchForm.render('north-div');
				
	var cm = new Ext.grid.ColumnModel([
		new Ext.grid.RowNumberer(),
	    {header:'用户名', dataIndex:'userName', sortable:true},
	    {header:'真实姓名', dataIndex:'realName', sortable:true},
	    {header:'性别', dataIndex:'sex', sortable:true},
	    {header:'Email', dataIndex:'email', sortable:true},
	    {header:'联系电话', dataIndex:'phone', sortable:true},
	    {header:'职务', dataIndex:'userDuty', sortable:true},
	    {header:'操作', dataIndex:'op', renderer: renderOp,width:100, align:'left'}
	]);
	
	function renderOp(value, cellmeta, record, rowIndex, columnIndex, stor) {
		var id = record.data.id;
		var delInfo = record.data.userName + ' ' + record.data.realName; 
		var editStr = '<img alt=\"编辑\" src=\"/MeowcashVisa/admin/images/edit.gif\" style=\"cursor: pointer;\" onclick=\"showInfo(\''+id+'\');\">';
		var delStr = '<img alt=\"删除\" src=\"/MeowcashVisa/admin/images/del.gif\" style=\"cursor: pointer;\" onclick=\"deleteUser(\''+id+'\', \'' + delInfo + '\');\">';
		return editStr + '&nbsp;&nbsp;&nbsp;&nbsp;' + delStr;
	}
	
	window.showInfo = function(id) {
		editForm.load({
			url: '/MeowcashVisa/admin/basic/UsersAction/getDetailInfo.action',
			params: {userId: id}
		});
		editWin.show();
	}
	
	window.deleteUser = function(id, delInfo) {
		if(id == 1) {
			Ext.MessageBox.alert('提示', 'admin不能删除！');
			return;
		}
		Ext.MessageBox.confirm('提示', '确定删除  ' + delInfo + ' ？', function(btn) {
			if(btn != 'yes') {
				return;
			}
			
			Ext.Ajax.request({
				method: 'post',
				url: '/MeowcashVisa/admin/basic/UsersAction/delete.action',
				params: {userId: id},
			   	success:function(resp){
			    	var obj=Ext.util.JSON.decode(resp.responseText);
			      	if(obj.result == 'success') {
			      		grid.getStore().reload();
			      		Ext.MessageBox.alert('提示', '删除成功！');
			      	}
			      	else {
			      		Ext.MessageBox.alert('报错了！！！', '删除失败！！！' + obj.info);
			      	}
			    }
			});
		});
	}
	
	var ds = new Ext.data.Store({
		proxy: new Ext.data.HttpProxy({url: '/MeowcashVisa/admin/basic/UsersAction/search.action'}),
		remoteSort: false,
		reader: new Ext.data.JsonReader(
			{
				totalProperty: 'total',
				idProperty:'id',
				root: 'invdata'
			},
			[
				{name: 'id'},
				{name: 'userName'},
				{name: 'realName'},
				{name: 'sex'},
				{name: 'email'},
				{name: 'phone'},
				{name: 'userDuty'}
			]
		)
	});

	ds.load({params: {start:0, limit:20}});
	
	var grid = new Ext.grid.GridPanel({
		el: 'grid',
		region: 'center',
		ds: ds,
		cm: cm,
	    viewConfig: {
	    	forceFit: true
	    },
	    bbar: new Ext.PagingToolbar({
		    pageSize: 20,
		    store: ds,
			displayInfo: true,
			displayMsg: '显示第{0}条到{1}条记录,一共{2}条',
			emptyMsg: '没有记录'
	    })
	});
	
	new Ext.Viewport({
		layout: 'border',
		items:[
		       searchForm,grid
		]
	});
});